<!--
  - Copyright (c) 2018.
  - 北京九思金信科技有限公司对该文件内容保留所有权利。
  - 未经许可，不得私自拷贝、传播、发布、引用该文件内容，违者将被追究法律责任。
  -->

<template>
    <div>
        <span v-if="!editing">{{category.itemName}}</span>
        <el-select  v-if="editing" v-model="category"
                    placeholder="请选择分类"
                    value-key="itemId"
                    :remote-method="remoteMethod"
                    filterable
                    remote
                    reserve-keyword
                    @change="change"
                    :disabled="disabled">
            <el-option
                    v-for="item in categoryData"
                    :key="item.itemId"
                    :label="item.itemName"
                    :value="item">
            </el-option>
        </el-select>
    </div>
</template>

<script>
export default {
    name: "FtQuotaCategory",
    props: {
        editing: {
            type: Boolean,
            default: true
        },
        disabled: {
            type: Boolean,
            default: false
        },
        categoryProp: {
            type: String,
            default: ''
        },
        parentIdProp: {
            type: String,
            default: ''
        },
        value: [String, Object]
    },
    mounted(){
        this.categoryFlag=this.categoryProp
        this.parentId=this.parentIdProp
        this.loadAll()
    },
    data(){
        return{
            //指标分类
            categoryFlag:this.categoryProp,
            //指标分类主键
            itemId: '',
            //指标分类父主键
            parentId:this.parentIdProp,
            //指标分类对象
            category:{},
            //指标分类集合
            categoryData:[]
        }
    },
    methods:{
        remoteMethod(query) {
            if (query) {
                let params = {
                    categoryFlag: this.categoryFlag,
                    parentId: this.parentId,
                    queryParam: query
                }
                this.$http.post('/joys-rest/lss-customer/indication/category', params).then(
                    resp => {
                        this.categoryData = resp.body
                    }, resp => {
                        this.$message.error(resp.body)
                    }
                )
            } else {
                this.loadAll()
            }
        },
        //全部加载分类
        loadAll() {
            let params = {
                categoryFlag: this.categoryFlag,
                parentId: this.parentId
            }
            this.$http.post('/joys-rest/lss-customer/indication/category', params).then(
                resp => {
                    this.categoryData = resp.body
                }, resp => {
                    this.$message.error(resp.body)
                }
            )
        },
        //change事件
        change() {
            let category = {}
            category['itemId']=this.category.itemId
            category['itemCode']=this.category.itemCode
            category['itemName']=this.category.itemName
            category['scoreList']=this.category.scoreList
            this.$emit('input', category)
            this.$emit('change', category)
        },
        //单个加载分类
        loadById() {
            this.category = {}
            if (this.itemId) {
                var url = '/joys-rest/lss-customer/indication/category/'
                this.$http.get(url + this.itemId).then(
                    resp => {
                        this.category = resp.body
                    }, resp => {
                        this.$message.error(resp.body.message)
                    }
                )
            }
        },
    },
    mounted() {
        this.itemId = this.value
        this.loadById()
        this.loadAll()
    },
    watch: {
        value(val) {
            this.itemId = val
            this.loadById()
        },
        categoryProp(val) {
            this.categoryFlag = val
        },
        parentIdProp(val) {
            this.parentId = val
            this.loadAll()
        },
    }
}
</script>

<style scoped>

</style>
